/* vue */
import { defineComponent } from "vue"
/* hooks */
import { useDialog } from "@hooks/useDialog"
/* component */
import OffSiteLoginDialogContent from "@src/modules/system/frame/component/OffSiteLoginDialog/content"
/* util */
import { getRootWindowInitData } from '@src/util/window'
import { storageGet, storageSet } from '@src/util/storageV2'
/* model */
import 
  RootWindowInitData, 
  {
    RemoteLoginRemind
  } 
from '@model/interface/initData/RootWindowInitData'
import LoginUser from "@model/entity/LoginUser/LoginUser"
/* scss */
import '@src/modules/system/frame/component/OffSiteLoginDialog/index.scss'
import StorageKeyEnum from "@model/enum/StorageKeyEnum"

export default defineComponent({
  name: "OffSiteLoginDialog",
  setup() {
    
    const { showDialog, hideDialog, changeVisible, visible } = useDialog()
    
    return {
      showDialog,
      hideDialog,
      changeVisible,
      visible
    }
    
  },
  data() {
    return {
    }
  },
  computed: {
    /**
     * @description 弹窗配置
     */
    attributes(): Record<string, any> {
      return {
        width: '500px',
        class: 'off-site-login-dialog',
        props: {
          width: '500px',
          title: this.title,
          show: this.visible
        },
        on: {
          'update:show': (value: boolean) => {
            this.changeVisible(value)
          }
        }
      }
    },
    /**
     * @description 弹窗标题
     */
    title() {
      return '异地登录提醒'
    },
    initData(): RootWindowInitData {
      return getRootWindowInitData()
    },
    user(): LoginUser | undefined {
      return this.initData?.user
    },
    userId(): string | undefined {
      return this.user?.userId
    },
    tenantType(): number | undefined {
      return this.initData?.tenantType
    },
    remoteLoginRemind(): RemoteLoginRemind | undefined {
      return this.initData?.remoteLoginRemind
    },
    account(): string {
      return this.remoteLoginRemind?.account || ''
    },
    loginTime(): number | undefined {
      return this.remoteLoginRemind?.loginTime
    },
    loginCity(): string | undefined {
      return this.remoteLoginRemind?.address
    },
    loginIP(): string | undefined {
      return this.remoteLoginRemind?.ip
    },
    loginMethod(): string | undefined {
      return this.remoteLoginRemind?.client
    },
    loginStatus(): string | undefined {
      return this.remoteLoginRemind?.status
    },
    content(): string {
      return this.remoteLoginRemind?.content || ''
    }
  },
  methods: {
    open() {
      this.show()
    },
    show() {
      
      const storageLoginTime = storageGet(StorageKeyEnum.RemoteLoginRemindLoginTime)
      
      if (storageLoginTime == this.loginTime) {
        return
      }
      
      this.showNotification()
      
      setTimeout(() => {
        storageSet(StorageKeyEnum.RemoteLoginRemindLoginTime, this.loginTime)
      })
      
    },
    showNotification() {
      this.$notify({
        title: '异地登录提醒',
        type: 'warning',
        message: this.content,
      })
    },
    hide() {
      this.hideDialog()
    },
    close() {
      this.hide()
    },
    onOpenUserView() {
      this.close()
    }
  },
  render() {
    
    const attrs = this.attributes
    
    return (
      <base-modal {...attrs}>
        <OffSiteLoginDialogContent
          accountNumber={this.account}
          userId={this.userId}
          tenantType={this.tenantType}
          loginTime={this.loginTime}
          loginCity={this.loginCity}
          loginIP={this.loginIP}
          loginMethod={this.loginMethod}
          loginStatus={this.loginStatus}
          onOpenUserView={this.onOpenUserView}
        />
      </base-modal>
    )
  }
})